<template>
  <view class="wrapper">
    <!-- <view class="title time">今日-第{{ liveDay }}天 </view> -->
    <view class="basic">
      <view class="title"> 基本信息</view>
      <view class="listContainer">
        <view class="list">
          <view class="type">姓名</view>
          <view class="detail"> {{ formInfo.name }} </view>
        </view>
        <!-- <view class="list">
          <view class="type">性别</view>
          <view class="detail"> {{ formInfo.gender=='1'?'男':formInfo.gender=='0'?'女':"" }} </view>
        </view> -->
        <view class="list">
          <view class="type">证件号</view>
          <view class="detail"> {{ formInfo.identity || "" }} </view>
        </view>

        <!-- 1.7先隐藏 -->
        <!-- <view class="list">
          <view class="type">核酸检测</view>
          <view class="detail"> {{ formInfo.nucleicAcid || "未检测" }} </view>
        </view>
        <view class="list" style="border: none">
          <view class="type">疫苗接种</view>
          <view class="detail">{{formInfo.vaccination?`第${formInfo.vaccination}针`:''  || "未接种"}}</view>
        </view> -->
      </view>
    </view>
    <view class="form-wrapper myform">
      <view class="title"> 填报内容</view>
      <view class="form-content">
        <view class="form-item inline-item">
          <view class="label">体温</view>
          <view
            class="value"
            :class="{ 'risk-value': parseFloat(formInfo.temperature) >= 37.3 }"
            >{{ formInfo.temperature || "-" }}</view
          >
        </view>
        <!-- <view class="form-item inline-item">
          <view class="label">血糖</view>
          <view class="value">{{ formInfo.xt || "-" }}</view>
        </view>
        <view class="form-item inline-item">
          <view class="label">血压</view>
          <view class="value" v-if="formInfo.xydy && formInfo.xygy"
            >{{ formInfo.xydy }}-{{ formInfo.xygy }}</view
          >
          <view class="value" v-else>-</view>
        </view>
        <view class="form-item inline-item">
          <view class="label">观察时间</view>
          <view class="value">{{ formInfo.gcsj || "-" }}</view>
        </view> -->
        <view class="form-item" v-if="formInfo.abnormalSymptoms == 1&&symptoms.length > 0">
          <view class="label">十大症状</view>
          <view class="symptoms">
            <template v-for="(item, index) in symptoms">
              <view :key="index" class="sub-value">
                {{ item }}
              </view>
            </template>
          </view>
          <!-- <view class="sub-value" >无</view> -->
        </view>
        <view class="form-item" v-else>
          <view class="inline-item">
            <view class="label">今日是否有异常症状</view>
            <view class="value">{{ formInfo.abnormalSymptoms == 1 ? "是" : "否" }}</view>
          </view>
          <template v-for="(item, index) in healthMildSymptoms">
            <view
              v-if="item.value === formInfo.abnormalSymptoms"
              class="sub-value"
              :key="index"
            >
              {{ item.label }}</view
            >
          </template>
        </view>

        <view class="form-item inline-item">
          <view class="label">昨日是否外出驿站</view>
          <view class="value">{{ formInfo.outingStation == 1 ? "是" : "否" }}</view>
        </view>
        <!-- <view class="form-item" :class="{ 'inline-item': !formInfo.yxjy }">
          <view class="label">医学建议</view>
          <view class="sub-value" v-if="formInfo.yxjy">{{
            formInfo.yxjy
          }}</view>
          <view class="value" v-else>-</view>
        </view> -->
      </view>
    </view>
    <view class="footer">
      <!-- <button class="cancle" @click="goBack">修改</button> -->
      <button class="dialogOk" @click="confirmSubmit">确定</button>
    </view>
  </view>
</template>

<script>
import {
  getUserInfoByCardId,
  getMedicalObservation,
  updateGzryData,
} from "@/api";
import { cardTypes, healthMildSymptoms, healthSevereSymptoms, checkWays } from "@/data";
export default {
  data() {
    return {
      cardTypeText: "",
      formInfo: {},
      userInfo: {}, //用户信息
      checkInInfo: {}, // 隔离信息
      symptoms: [], // 症状
      checkWays, // 采样方式
      cardTypes,
      liveDay: 1,
    };
  },
  onLoad(options) {
    this.liveDay = options.day;
  },
  onShow() {
    this.initObservedInfo();
  },
  methods: {
    // 初始化观察信息
    initObservedInfo() {
      let formInfo = uni.getStorageSync("gzryOtherInfo");
      this.formInfo = formInfo;
      if (formInfo.symptoms && formInfo.symptoms.length > 0) {
        healthMildSymptoms.forEach((item) => {
          if (formInfo.symptoms.includes(item.value)) {
            this.symptoms.push(item.text);
          }
        });
      }
      if (formInfo.secondarySymptoms && formInfo.secondarySymptoms.length > 0) {
        healthSevereSymptoms.forEach((item) => {
          if (formInfo.secondarySymptoms.includes(item.value)) {
            this.symptoms.push(item.text);
          }
        });
      }
      if (formInfo.otherSymptoms) {
        this.symptoms.push(formInfo.otherSymptoms);
      }

      this.formInfo = formInfo;
    },
    // 确认提交
    confirmSubmit() {
      let that = this;
      that.formInfo.symptoms = that.formInfo.symptoms.join(",");
      that.formInfo.secondarySymptoms = that.formInfo.secondarySymptoms.join(",");
      uni.showLoading();
      
      //如果add.vue页面没有获取到用户的 名字 和 证件号，再次请求接口获取
      if (that.formInfo.name == '' || that.formInfo.identity == '') {
        getGzryInfo().then((res) => {
          that.otherInfo = res;
          that.formInfo.identityType = res.cardType;
          that.formInfo.identity = res.idCard;
          that.formInfo.name = res.realName;
          that.formInfo.nucleicAcid = res.inspectionItemResult;
          that.formInfo.vaccination = res.needleTimes;
          // that.formInfo.temperature = res.temperature;
          // that.getSex(res.idCard);
          updateGzryData(that.formInfo).then((res) => {
            uni.removeStorage("gzryOtherInfo");
            uni.navigateTo({
              url: "./success?type=medicalObservation",
            });
            uni.hideLoading();
          });
        });
      }else{
        updateGzryData(that.formInfo).then((res) => {
          uni.removeStorage("gzryOtherInfo");
          uni.navigateTo({
            url: "./success?type=medicalObservation",
          });
          uni.hideLoading();
        });
      }
    },
    goBack() {
      uni.navigateBack();
    },
  },
};
</script>

<style lang="scss">
.wrapper {
  background-color: #f9f9f9;
  padding-bottom: 50rpx;

  .title {
    height: 98rpx;
    line-height: 98rpx;
    font-size: 40rpx;
    padding: 0 32rpx;
    background-color: #fff;
    border-bottom: 1rpx solid #e5e5e5;
  }
  .time {
    color: #2c9af1;
    border-bottom: none;
    background-color: #fff;
  }
  .footer {
    //display: flex;
    //justify-content: space-between;
    // border: 1rpx solid #cccccc;
    .cancle {
      width: 328rpx;
      color: #000000;
      font-size: 34rpx;
      border: 1rpx solid #cccccc;
      border-radius: 16rpx;
      margin-right: 30rpx;
      background-color: #fff;
    }
    .dialogOk {
      margin: 0 32rpx;
      margin-top: 30rpx;
      height: 94rpx;
      line-height: 94rpx;
      background: #2c9af1;
      opacity: 1;
      border-radius: 16rpx;
      color: #fff;
      font-size: 30rpx;
      outline: none !important
    }
  }
}
// 基本信息
.basic {
  margin-bottom: 30rpx;
  background: #ffffff;

  .listContainer {
    padding: 0 32rpx;
  }
  .list {
    height: 140rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 0.5px solid #e5e5e5;
  }
  .type {
    font-size: 30rpx;
    font-family: PingFang SC;
    color: #999999;
    opacity: 1;
  }
  .detail {
    font-size: 34rpx;
    font-family: PingFang SC;
    color: #666666;
    opacity: 1;
  }
}
// 表单
.form-wrapper {
  .form-content {
    padding: 20rpx 32rpx;
    background-color: #fff;
  }
  .risk-value {
    color: red !important;
  }
  .submit {
    margin-top: 30rpx;

    height: 94rpx;
    line-height: 94rpx;
    background: #2c9af1;
    opacity: 1;
    border-radius: 16rpx;
  }
  .form-item {
    margin-bottom: 30rpx;
    .label {
      font-weight: bold;
      color: #333333;
      font-size: 26rpx;
      margin-bottom: 30rpx;
    }
    .value {
      font-weight: bold;
      color: #333333;
      font-size: 26rpx;
      margin-bottom: 30rpx;
    }
    .sub-value {
      color: #666666;
      font-size: 26rpx;
    }
  }
  .inline-item {
    display: flex;
    // align-items: center;
    justify-content: space-between;
  }
  .symptoms {
    // display: flex;
    overflow: hidden;

    .sub-value {
      float: left;

      margin-right: 20rpx;
      margin-bottom: 10rpx;
      color: #2c9af1;
    }
  }
}
</style>
